var names = document.querySelector('#num');
var passwords = document.querySelector("#password");


$('.copyright span').hover(function() {
	$(this).css("color", "#ff6700");
}, function() {
	$(this).css("color", "");
});

names.onblur = inputBlur;
password.onblur = inputBlur;


function inputBlur() {
	//获取当前文本框的id属性值
	var id = this.id;
	// 获取输入框的value属性值
	var val = this.value;
	// 获取输入框中的提示信息placeholder属性值
	var tips = this.placeholder;
	//根据id获取提示信息显示的<span>元素对象
	var tips_obj = document.getElementById(this.id + "1");
	// 1. 去掉两端的空白字符
	val = val.trim();
	// 2. 文本框内容为空，给出提示信息
	if (!val) {
		//调用error(obj,msg)函数,在<span>标签内显示出错误信息
		error(tips_obj, '输入不能为空');
		return false;
	}
	// 3. 获取正则匹配规则和提示信息
	var reg_msg = getRegMsg(id, tips);
	// 4. 通过test()方法检测输入的值是否和正则表达式匹配
	if (!reg_msg['reg'].test(val)) {
		// 匹配失败，显示失败的提示信息
		//调用error(obj,msg)函数,在<span>标签内显示出错误信息
		error(tips_obj, reg_msg['msg']['error']);
	} else {
		// 匹配成功，显示成功的提示信息
		//调用success(obj,msg)函数,在<span>标签内显示出成功信息
		success(tips_obj, reg_msg['msg']['success']);
	}
}

function getRegMsg(id, tips) {
	//通过reg定义正则表达式,msg对象保存匹配和不匹配的提示信息
	var reg = msg = '';
	switch (id) {

		//如果id="name",即输入用户名时,匹配用户名的正则表达式
		case 'num':
			//学号的正则表达式
			reg = /^[a-zA-Z0-9]{6,10}$/;
			msg = {
				'success': '用户名格式正确',
				//不匹配则显示placeholder的内容
				'error': tips
			};
			break;
		case 'password':
			//密码的正则表达式
			reg = /^[a-zA-Z0-9]{6,10}$/;
			msg = {
				'success': '密码格式正确',
				'error': tips
			};
			break;
	}
	//返回提示信息对象
	return {
		'reg': reg,
		'msg': msg
	};
}
//匹配成功
function success(obj, msg) {
	//设置提示框的样式名为success
	obj.className = 'success';
	//设置<span>框内显示成功信息
	obj.innerHTML = msg;
}
//匹配失败
function error(obj, msg) {
	//设置提示框的样式名为error
	obj.className = 'error';
	//设置<span>框内显示错误信息
	obj.innerHTML = msg;
}
var logoButton = document.getElementById('btn');

//通过判断<span>提示框的样式,判断是否可以提交注册
function flag() {
	//根据标签名称,获取所有span标签,即存放提示信息的对象

	//保存错误提示的个数,初始为0
	var j = 0
	var names1 = document.querySelector('#num1');
	var pwd = document.querySelector('#password1');
	if (names1.className != "success") {
		j++;
	}


	if (pwd.className != "success") {
		j++;
	}

	//如果提交时有错误信息,则注册失败
	if (j > 0) {
		alert("格式错误!");
		///通过for...in语句将提示框清空
		pwd.innerHTML = "";
		names1.innerHTML = "";
		return false;
	} else {
		var username = names.value;
		var password = passwords.value;
		var xhr = new XMLHttpRequest();
		var url = 'back.php?username=' + username + "&password=" + password;
		xhr.open('GET', url);
		xhr.onreadystatechange = function() {
			if (xhr.readyState == 4) {
				if (xhr.status == 200) {
					// alert(1);
					var data = xhr.responseText;

					console.log(data);
					if (data == 1) {
						alert("密码错误!")
					} else if (data == 2) {
						alert('登录成功');
					}
				}
			};
		}
		xhr.send(null);
		// alert(2);
	}
}

logoButton.addEventListener('click', function() {
	flag();
});

pwdmin = 6;


$('#switch_qlogin').click(function() {
	$('#switch_login').removeClass("switch_btn_focus").addClass('switch_btn');
	$('#switch_qlogin').removeClass("switch_btn").addClass('switch_btn_focus');
	$('#switch_bottom').animate({
		left: '0px',
		width: '70px'
	});
	$('#qlogin').css('display', 'none');
	$('#web_qr_login').css('display', 'block');

});
var vl = 0;
$('#switch_login').click(function() {

	$('#switch_login').removeClass("switch_btn").addClass('switch_btn_focus');
	$('#switch_qlogin').removeClass("switch_btn_focus").addClass('switch_btn');
	$('#switch_bottom').animate({
		left: '154px',
		width: '70px'
	});

	$('#qlogin').css('display', 'block');
	$('#web_qr_login').css('display', 'none');
});

$("#user").blur(function() {
	if ($('#user').val() == "") {
		$('#userCue').html("<font color='red'><b>×用户名不能为空</b></font>");
		return false;
	}

	if ($('#user').val().length < 6 || $('#user').val().length > 10) {
		$('#userCue').html("<font color='red'><b>×用户名位6-10字符</b></font>");
		return false;

	}
	
	$('#userCue').html("<font color='skyblue'><b>用户名输入正确!</b></font>");
});
$("#passwd").blur(function() {

	if ($('#passwd').val().length < 6) {
		$('#passwd').focus();

		$('#userCue').html("<font color='red'><b>×密码不能小于6位</b></font>");
		return false;

	}
	$('#userCue').html("<font color='skyblue'><b>密码输入正确!</b></font>");

});
$("#passwd2").blur(function() {

	if ($('#passwd2').val() != $('#passwd').val()) {
		vl++;
		$('#passwd2').focus();
		$('#userCue').html("<font color='red'><b>×两次密码不一致！</b></font>");
		return false;
	}

	$('#userCue').html("<font color='skyblue'><b>密码输入正确!</b></font>");
});

$("#reg").click(function() {

	//如果提交时没有错误信息,则注册成功,提交表单
	var name = $('#user').val();
	var passwd = $("#passwd").val();
	console.log(name);
	console.log(passwd);
	vl = 0;
	var xhr0 = new XMLHttpRequest();
	var url = 'ajaxzc.php?username=' + name + "&password=" + passwd;
	xhr0.open('GET', url);
	xhr0.onreadystatechange = function() {
		if (xhr0.readyState == 4) {
			if (xhr0.status == 200) {

				var data = xhr0.responseText;
				console.log(data);
				var obj = JSON.parse(data)
				alert('用户名:' + obj['user'] + '\n密码:' + obj['password']);
			}
		};
	}
	xhr0.send(null);



});
